import React, { Component } from 'react'
import { Form, Input, Button, message } from 'antd'
import styles from './index.less'
import { subject } from '../../../api/index'

export default class index extends Component {


    state = {
        formRules: {
            coursenum: [
                {
                    required: true,
                    message: '课程数不能为空',
                },
            ],
            id: [
                {
                    required: true,
                    message: '科目ID不能未空',
                },
            ],
            name: [
                {
                    required: true,
                    message: '科目名称不能未空',
                },
            ],
            sort: [
                {
                    required: true,
                    message: '科目序号不能为空',
                },
            ]
        },
        loading: false,
    }

    onFinish = async (values) => {
        this.setState({ loading: true })
        const data = await subject.addSubject(values)
        if (data.code === 200) {
            message.success('新增成功')
            this.formNode.resetFields(['id', 'sort', 'coursenum', 'name'])
        } else {
            message.error('新增失败')
            console.log(data);
        }
        this.setState({ loading: false })
    }

    onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo)
    }

    render() {
        const { formRules, loading } = this.state
        return (
            <div id="subject">
                <div className={styles.form}>
                    <Form ref={node => { this.formNode = node }} onFinish={this.onFinish} onFinishFailed={this.onFinishFailed} layout="vertical">
                        <Form.Item rules={formRules.name} name='name' label="科目名称:">
                            <Input disabled={loading} />
                        </Form.Item>
                        <Form.Item rules={formRules.coursenum} name='coursenum' label="课程数:">
                            <Input disabled={loading} />
                        </Form.Item>
                        {/* <Form.Item rules={formRules.id} name='id' label="科目ID:">
                            <Input disabled={loading}/>
                        </Form.Item> */}

                        <Form.Item rules={formRules.sort} name='sort' label="科目序号:">
                            <Input disabled={loading} />
                        </Form.Item>
                        <Form.Item wrapperCol={{ offset: 9, span: 16 }}>
                            <Button htmlType='submit' loading={loading}>新增</Button>
                        </Form.Item>
                    </Form>
                </div>
            </div>
        )
    }
}
